<template>
  <div class="container">
    <el-dialog
      title="店铺订单详情"
      :visible.sync="detailsDialog.centerDialogVisible"
      @open="getData"
      @close="confirm"
      center
    >
      <el-form
        :model="formData"
        status-icon
        ref="ruleForm"
        label-width="100px"
        class="demo-ruleForm"
      >
        <el-form-item label="店铺名称：">
          <el-input v-model="formData.org_name" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="店铺Code：">
          <el-input v-model="formData.order_code" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="店铺地址：">
          <el-input v-model="formData.org_address" :disabled="true"></el-input>
        </el-form-item>
      </el-form>
      <el-table :data="tableData" border style="width: 100%" empty-text="暂无数据">
        <el-table-column prop="goods_name" label="商品名称" align="center"></el-table-column>
        <el-table-column prop="category_name" label="商品种类" align="center"></el-table-column>
        <el-table-column prop="goods_unit" label="规格" align="center"></el-table-column>
      </el-table>
    </el-dialog>
  </div>
</template>
<script>
import { findOrderInfo } from "@/api/commodity/commodityList";
export default {
  props: {
    detailsDialog: Object
  },
  data() {
    return {
      tableData: [],
      formData: {}
    };
  },
  created() {},
  methods: {
    //关闭
    confirm() {
      this.detailsDialog.centerDialogVisible = false;
    },
    // 获取数据
    getData() {
      let data = {
        id: this.detailsDialog.id
      };
      findOrderInfo(data).then(res => {
        if (res.code == 0) {
          this.tableData = res.data.info.order_goods;
          this.formData = res.data.info;
        }
      });
    }
  }
};
</script>
<style scoped>
.pagination {
  text-align: right;
  padding: 10px;
  background-size: cover;
}
.title {
  text-align: center;
  line-height: 40px;
  font-size: 16px;
  font-weight: bold;
}
</style>